import React from 'react';
import { Form, Switch, Select, Radio, Button, Space, Divider } from 'antd';
import { SettingOutlined, BellOutlined, EyeOutlined } from '@ant-design/icons';
import { menuStore } from '../../../../store/public/menuStore.ts';
import { observer } from 'mobx-react-lite';

const { Option } = Select;

const PersonalSettings: React.FC = observer(() => {

  return (
    <div style={{ padding: '20px' }}>
      <Form layout="vertical">
        <Form.Item label="界面主题" extra="选择您喜欢的界面主题">
          <Radio.Group value={menuStore.theme} onChange={(e) => menuStore.setTheme(e.target.value)}>
            <Radio.Button value="light">浅色</Radio.Button>
            <Radio.Button value="dark">深色</Radio.Button>
          </Radio.Group>
        </Form.Item>

        <Divider />

        {/* <Form.Item label="语言设置" extra="选择界面显示语言">
          <Select defaultValue="zh_CN" style={{ width: 200 }} disabled>
            <Option value="zh_CN">简体中文</Option>
            <Option value="en_US">English</Option>
          </Select>
        </Form.Item>

        <Divider />

        <Form.Item label="消息通知" extra="管理各类消息的通知方式">
          <Space direction="vertical" style={{ width: '100%' }}>
            <Form.Item label="系统通知" extra="接收系统更新、维护等通知">
              <Switch defaultChecked={false} disabled/>
            </Form.Item>
            <Form.Item label="邮件通知" extra="接收重要消息的邮件通知">
              <Switch defaultChecked={false} disabled/>
            </Form.Item>
          </Space>
        </Form.Item>

        <Divider />

        <Form.Item label="隐私设置" extra="管理您的隐私选项">
          <Space direction="vertical" style={{ width: '100%' }}>
            <Form.Item label="在线状态" extra="是否向其他用户显示您的在线状态">
              <Switch defaultChecked={false} disabled/>
            </Form.Item>
            <Form.Item label="活动记录" extra="是否允许记录您的活动历史">
              <Switch defaultChecked={false} disabled/>
            </Form.Item>
          </Space>
        </Form.Item> */}

        {/* <Form.Item>
          <Button type="primary">保存设置</Button>
        </Form.Item> */}
      </Form>
    </div>
  );
});

export default PersonalSettings; 